html, body {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.webapp {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #121212;
}
.swiper {
    width: 100%;
    height: 100%;
    overflow: hidden;
    &__slider {
        width: 100%;
        height: 100%;
        overflow: hidden;
        background: #fff;
    }
}
.x-toast.success {
    .x-toast__inner {
        padding: 0.3rem;
        p {
            text-align: center;
        }
    }
    .x-toast__inner:before {
        content: "";
        display: block;
        width: 1.5rem;
        height: 1rem;
        background: url("assets/images/icon_success.png");
        background-size: 100% 100%;
        margin-bottom: 0.2rem;
    }
}
.fadeInTop {
    transform: translate(0, .1rem);
    opacity: 0;
    transition: all 0.3s ease-out;
    &.done {
        transform: translate(0, 0);
        opacity: 1;
    }
}
.fadeInRight {
    transform: translate(-.1rem, 0);
    opacity: 0;
    transition: all 0.3s ease-out;
    &.done {
        transform: translate(0, 0);
        opacity: 1;
    }
}
.fadeLine {
    transform: scale(0,1);
    transform-origin: center;
    &.done {
        transition: transform 0.5s ease-out;
        transform: scale(1,1);
    }
}
.fadeScale {
    transform: scale(.6,.6);
    opacity: 0;
    transform-origin: center;
    &.done {
        transition: all 0.24s ease-out;
        transform: scale(1,1);
        opacity: 1;
    }
}
.fadeBg {
    transform: scale(1.2,1.2);
    transform-origin: center;
    &.done {
        transition: transform 10s ease-out;
        transform: scale(1,1);
    }
}